<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			.a{
				width: 100px;
				height: 150px;
				background: beige;
			}
			.a ul li ul{
			
			display: none;/*将 二级 菜单隐藏起来*/
			
			}
			
			.a ul li:hover ul{
			
			display: block;/*当鼠标移动到一级标签后，ul即二级菜单显示出来*/

}

    </style>

	</head>
	<body>

		<div class="a">
		
			<ul>
			
				<li>
				
					<a href="#">相册</a>
					
					<ul class="d">
					
						<li><a href="#">添加照片</a></li>
						
						<li><a href="#">删除照片</a></li>
					
					</ul>
					
				</li>
			
			</ul>
			<ul>
			
				<li>
				
					<a href="#">日记</a>
					
					<ul class="d">
					
						<li><a href="#">写日记</a></li>
						
						<li><a href="#">删日记</a></li>
					
					</ul>
					
				</li>
			
			</ul>
			<ul>
			
				<li>
				
					<a href="#">写信</a>
					
					<ul class="d">
					
						<li><a href="#">写信</a></li>
						
						<li><a href="#">彩信</a></li>
					
					</ul>
					
				</li>
			
			</ul>
			<ul>
			
				<li>
				
					<a href="#">故事机</a>
					
					<ul class="d">
					
						<li><a href="#">写故事</a></li>
						
						<li><a href="#">浏览</a></li>
					
					</ul>
					
				</li>
			
			</ul>
		
		</div>

</body>

</html>
